<template>
  <div>
    <div style="width: 700px;margin: 0 auto;">
      <el-timeline>
        <div v-for="blog in blogs" :key="blog.id">
          <el-timeline-item :timestamp="blog.createTime" placement="top" color="#0bbd87">
            <el-card>
              <h4>发布文章</h4>
              <p>{{ blog.title }} {{ blog.createTime }}</p>
            </el-card>
          </el-timeline-item>
        </div>
      </el-timeline>


    </div>
  </div>
</template>

<script>
export default {
  name: "Timeline",
  data() {
    return {
      blogs: [],
    }
  },
  methods: {
    getAllBlogs() {
      this.$http({
        url: `blog/all`
      }).then(({data}) => {
        if (data && data.code === 0) {
          this.blogs = data.data;
        }
      })
    },
  },
  mounted() {
    this.getAllBlogs();
  }
}
</script>

<style scoped>

</style>
